export let aa = {
  inserted() {},
};

export let bb = {
  inserted() {},
};

// v-html v-if v-show v-for ....
// 指令的作用：操作DOM
// 自定义指令的作用： 自定义一个指令来实现对DOM的操作
// 需求: 通过自定义指令的形式解决异常图片的处理  (对DOM操作的需求)
// 如何定义自定义指令：
export const imgerror = {
  // 指令所在的DOM节点插入文档中的时候触发
  inserted(el, binding) {
    // console.log("指令所在的DOM节点插入文档中的时候触发");
    // el 是指令所的DOM节点信息
    // binding 是指令所包含的信息
    // console.log(el);
    // console.log(binding.value);  // 指令绑定的数据值
    // 图片、音频、视频标签等资源标签都有一个原生的事件叫做onerror，就是当加载出错的时候触发
    el.src = el.src || binding.value;
    el.onerror = () => {
      //   console.log("图片加载不出来");
      // 重新给img标签的src赋值
      el.src = binding.value;
    };
  },
  // 指令所在的组件更新的时候
  componentUpdated(el, binding) {
    // console.log("指令所在的DOM节点componentUpdated文档中的时候触发");
    el.src = el.src || binding.value;
  },
};
